<%@page import="org.smartercontext.contextmger.DTO.ProductDTO"%>
<%@page import="java.util.List"%>
<%@page import="org.smartercontext.contextmger.utilities.GetProducts"%>
<%@page import="com.hp.hpl.jena.rdf.model.Model"%>
<%@page import="org.smartercontext.contextmger.contextsphere.ContextManagerController"%>
<%@page contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    	               "http://www.w3.org/TR/html4/loose.dtd">

<html lang="en">
 <head>
 	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Products</title>
    <!-- Bootstrap core CSS -->
    <link rel="shortcut icon" href="Icons/scicon.png">
    <link href="http://getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="http://getbootstrap.com/examples/dashboard/dashboard.css" rel="stylesheet">

    <!-- Just for debugging purposes. Don't actually copy this line! -->
    <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  <style type="text/css"></style>
 </head>
   <body style="background-color: #eee;">
<%
	
		if(session.getAttribute("username")==null){
			response.sendRedirect("login.jsp?Err=3");
		}
	
	%>
    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation" >
      <div class="container-fluid">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="index.jsp">
          <img src="Images/logoSmartContext_CircleH.png">
          <img src="Images/logoSmartContext_header.png"></a>
        </div>
        
        <div class="navbar-collapse collapse">
          <ul class="nav navbar-nav navbar-right">
          	<li><a href="index.jsp">Home</a></li>
            <li class="active"><a href="manageContext.jsp">Manage your context</a></li>
            <li><a href="recommendations.jsp">Recommendations</a></li>
            <li><a href="linkWith.jsp">Link with...</a></li>
            <li><a href="logout.jsp">Logout</a></li>
          </ul>
          <form class="navbar-form navbar-right" action="">
            <input type="text" class="form-control" placeholder="Search...">
          </form>
        </div><!--/.nav-collapse -->
      </div>
    </div>

	<div class="container-fluid">
	 <div class="row">
	 	 <div class="col-sm-3 col-md-2 sidebar">
          <ul class="nav nav-sidebar">
            <li><a href="manageContext.jsp">Overview</a></li>
            <li><a href="manageContext_Profile.jsp">Profile</a></li>
            <li><a href="manageContext_W&S.jsp">Work & Study</a></li>
            <li><a href="manageContext_F&F.jsp">Friends & Family</a></li>
            <li><a href="manageContext_M&M.jsp">Movies, Music & Books</a></li>
            <li class="active"><a href="manageContext_Products.jsp">Products</a></li>
            <li><a href="manageContext_PaymentM.jsp">Preferred Payment Method</a></li>
            <li><a href="PrintRDFGraphServlet" target="_blank">Watch my RDF Graph</a></li>
          </ul>
        </div>
      </div>
     </div>
     
     <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
     	<h1 class="page-header">Products</h1>
     	<div style="text-align: center;">
     		<h3 class="sub-header">Products wishlist</h3>
     		<table class="table table-striped" id="tablePrefsW" style="text-align: left;">
     		<thead>
     			<tr>
     				<th>Product name</th>
     				<th>Options</th>
     			</tr>
     		</thead>
     		<tbody>
     		<%
     		
     		if(session.getAttribute("username")!=null){	
     			String username = session.getAttribute("username").toString();
					ContextManagerController.contextManagerController();
					Model usermodel = ContextManagerController.getUsermodel(username);
					
					GetProducts gp = new GetProducts();
					gp.getListProducts(usermodel, username);
					List<ProductDTO>wishes =gp.getWishlist();
					
					for(int i=0;i<wishes.size();i++){
						ProductDTO pdto = wishes.get(i);
						String name = pdto.getName();
						
						out.println("<tr><td>"+name+"</td><td><a href=\"DeleteProduct?nameToDelete="+name+"&type=pwish\">Delete</a></td></tr>");
					}
     		
     		%>
     		</tbody>
     		</table>
     	</div>
     	<div style="text-align: center;">
     		<h3 class="sub-header">Product rating</h3>
     		<form action="ModifyRankingServlet">
     			<table class="table table-striped" id="tableMMB" style="text-align: left;">
     				<thead>
     					<tr>
     						<th>Product name</th>
     						<th>Rating</th>
     					</tr>
     				</thead>
     				<tbody id="tbodyM">
     				
     				</tbody>
     			</table>
     			<% 
     			if(request.getQueryString()!=null){
     				String error = request.getParameter("Error");
     				if(error.equals("1")){
     					out.println("<p style=\"color:maroon\">Error: The info. hasn't added to your context sphere</p>");
     				}else if(error.equals("2")){
     					out.println("<p style=\"color:maroon\">Error: The info. hasn't modified</p>");
     				}else if(error.equals("3")){
     					out.println("<p style=\"color:maroon\">Error: The info. hasn't deleted</p>");
     				}
     			}
     			%>
     			<button class="btn btn-sm btn-primary" type="submit" id="subM" style="width: 10em; height: 3em;" disabled="disabled">Save changes</button>
     		</form>
     		<table class="table table-striped" id="tablePrefs" style="text-align: left;">
     			<thead>
     				<tr>
     					<th>Product name</th>
     					<th>Your rating</th>
     					<th>Options</th>
     				</tr>
     			</thead>
     			<tbody>
     				<%
     					List<ProductDTO>pranked = gp.getRanked();
     				
     					for(int i=0;i<pranked.size();i++){
     						ProductDTO pdto = pranked.get(i);
     						String name = pdto.getName();
     						String points = pdto.getRating();
     						int pont = Integer.parseInt(points);
     						
     						out.println("<tr><td>"+name+"</td><td>"+points+"</td><td><a href=\"javascript:editR('"+name+"',"+pont+")\">Edit rating</a> - <a href=\"DeleteProduct?nameToDelete="+name+"&type=prank\">Delete</a></td></tr>");
     					}
     						
     					}
     				%>
     			</tbody>
     		</table>
     	</div>
     
     </div>

 <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
	<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

	<script type="text/javascript" charset="ISO-8859-1">
	
		var counter = 0;
		
		function editR(name, ponts){
			
			document.getElementById("subM").disabled = false;
			var newrow = document.createElement('tr');
			
			if(ponts == 1){
				newrow.innerHTML = "<tr><td><input type='text' name='nameJAV"+counter+"' value='"+name+"' size='40' readonly/></td><td>"+
				"<input type='radio' name='valueJAV"+counter+"' value='1' checked='checked' />1 "+
				"<input type='radio' name='valueJAV"+counter+"' value='2' />2 "+
				"<input type='radio' name='valueJAV"+counter+"' value='3' />3 "+
				"<input type='radio' name='valueJAV"+counter+"' value='4' />4 "+
				"<input type='radio' name='valueJAV"+counter+"' value='5'/>5 "+
				"</td></tr>";
			}
			
			if(ponts == 2){
				newrow.innerHTML = "<tr><td><input type='text' name='nameJAV"+counter+"' value='"+name+"' size='40' readonly/></td><td>"+
				"<input type='radio' name='valueJAV"+counter+"' value='1'  />1 "+
				"<input type='radio' name='valueJAV"+counter+"' value='2' checked='checked'/>2 "+
				"<input type='radio' name='valueJAV"+counter+"' value='3' />3 "+
				"<input type='radio' name='valueJAV"+counter+"' value='4' />4 "+
				"<input type='radio' name='valueJAV"+counter+"' value='5'/>5 "+
				"</td></tr>";
			}
			
			if(ponts == 3){
				newrow.innerHTML = "<tr><td><input type='text' name='nameJAV"+counter+"' value='"+name+"' size='40' readonly/></td><td>"+
				"<input type='radio' name='valueJAV"+counter+"' value='1'  />1 "+
				"<input type='radio' name='valueJAV"+counter+"' value='2' />2 "+
				"<input type='radio' name='valueJAV"+counter+"' value='3' checked='checked'/>3 "+
				"<input type='radio' name='valueJAV"+counter+"' value='4' />4 "+
				"<input type='radio' name='valueJAV"+counter+"' value='5'/>5 "+
				"</td></tr>";
			}
			
			if(ponts == 4){
				newrow.innerHTML = "<tr><td><input type='text' name='nameJAV"+counter+"' value='"+name+"' size='40' readonly/></td><td>"+
				"<input type='radio' name='valueJAV"+counter+"' value='1' >1 "+
				"<input type='radio' name='valueJAV"+counter+"' value='2'>2 "+
				"<input type='radio' name='valueJAV"+counter+"' value='3'>3 "+
				"<input type='radio' name='valueJAV"+counter+"' value='4' checked='checked'>4 "+
				"<input type='radio' name='valueJAV"+counter+"' value='5'>5 "+
				"</td></tr>";
			}
			
			if(ponts == 5){
				newrow.innerHTML = "<tr><td><input type='text' name='nameJAV"+counter+"' value='"+name+"' size='40' readonly/></td><td>"+
				"<input type='radio' name='valueJAV"+counter+"' value='1'  />1 "+
				"<input type='radio' name='valueJAV"+counter+"' value='2' />2 "+
				"<input type='radio' name='valueJAV"+counter+"' value='3' />3 "+
				"<input type='radio' name='valueJAV"+counter+"' value='4' />4 "+
				"<input type='radio' name='valueJAV"+counter+"' value='5' checked='checked'/>5 "+
				"</td></tr>";
			}
			
			document.getElementById("tbodyM").appendChild(newrow);
			counter++;
			
		}
	
	</script>
</body>
</html>